<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陆</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css"
          integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <style>
        a{
            color: white;
        }
        .card{
            width: 500px;
            margin: 100px auto;
            text-align: center;
           border-radius: 0;
        }
        .inner{
            margin: 40px 0px;
        }
        button{
            width: 100%;
        }
        body{
            background: url("/images/bg1.jpg");
            /*background-color: #208FF9;*/
           /* background-color: #1ABC9c;*/
            opacity: 0.9;
        }
        .title{
            text-align: center;
            margin-top: 100px;
        }
    </style>
</head>
<body>
<h1 class="title">学生请假系统</h1>
<div class="card">
    <div class="card-body">
        <form action="/login" method="post">
            <h3>登录</h3>
            <div class="inner">
                <!-- <label for="username">账号：</label> -->
                <input id="username" class="form-control" type="text" name="userId" placeholder="请输入学号/班主任账号">
            </div>
            <div class="inner">
                <!-- <label for="password">密码：</label> -->
                <input id="password" class="form-control" type="password" name="password" placeholder="请输入密码">
            </div>
            <div style="display: flex;justify-content: space-between;padding: 0 10px">
                <div class="custom-control custom-switch" style="text-align: left">
                    <input type="checkbox" class="custom-control-input" id="customSwitch1" name="role" value="teacher">
                    <label class="custom-control-label" for="customSwitch1">班主任</label>
                </div>
                <div class="custom-control custom-switch" style="text-align: right">
                    <input type="checkbox" class="custom-control-input" id="admin" name="role" value="admin">
                    <label class="custom-control-label" for="admin">管理员</label>
                </div>
            </div>


            <div class="inner">
                <button class="btn btn-primary" type="submit">登录</button>
            </div>
        </form>
        <div class="inner">
            <a href="add.html"><button class="btn btn-primary" type="button">注册</button></a>
        </div>
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.slim.min.js"
        integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n"
        crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
        crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/js/bootstrap.min.js"
        integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
        crossorigin="anonymous"></script>
</body>
</html>